<!doctype html>
<html>
<head>
	<meta charset="UTF-8">
	<title>微商城</title>
	<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
	<meta name="format-detection" content="telephone=no">
	<link rel="stylesheet" href="css/reset.css">
	<link rel="stylesheet" href="css/style.css">
	<link rel="stylesheet" href="css/swiper.min.css">
</head>
<body>
	<section class="head">
		<h1>全部商品</h1>
		<a class="more" href="javascript:void(0);"><i class="iconfont icon-fenxiang"></i></a>
	</section>
	<section class="search mt15 clearfix">
		<div class="search-box box-shadow">
			<i class="iconfont icon-sousuo"></i>
			<input type="text" placeholder="请输入商品名称">
		</div>
	</section>
	<section>
		<div class="screen-box">
			<span>销量从高到低</span><i class="iconfont icon-xiala"></i>
			<ul>
				<li>按时间顺序</li>
				<li>销量从高到低</li>
				<li>价格从高到低</li>
				<li>价格从低到高</li>
			</ul>
		</div>
	</section>
	<section class="product">
		<ul class="clearfix">
			<li>
				<a href="javascript:void(0);">
					<dl class="box-shadow">
						<dt>
							<img src="images/pro1_1.png" alt="男士服装" title="男士服装">
						</dt>
						<dd class="money-box">
							<strong>¥299</strong>
							<span>¥399</span>
						</dd>
						<dd class="box">
							<p>无印良品クコットン男<br>装衬衫Ｓ・ブルー</p>
						</dd>
						<dd class="btn">
							<i class="iconfont icon-buynow"></i>
							<span>立即购买</span>
						</dd>
					</dl>
				</a>
			</li>
			<li>
				<a href="javascript:void(0);">
					<dl class="box-shadow">
						<dt>
							<img src="images/pro1_2.png" alt="男士服装" title="男士服装">
						</dt>
						<dd>
							<strong>¥199</strong>
						</dd>
						<dd class="box">
							<p>无印良品クコットン男<br>装简装Ｓ・ブルー</p>
						</dd>
						<dd class="btn">
							<i class="iconfont icon-buynow"></i>
							<span>立即购买</span>
						</dd>
					</dl>
				</a>
			</li>
			<li>
				<a href="javascript:void(0);">
					<dl class="box-shadow">
						<dt>
							<img src="images/pro1_3.png" alt="男士服装" title="男士服装">
						</dt>
						<dd>
							<strong>¥163</strong>
						</dd>
						<dd class="box">
							<p>无印良品クコットン男<br>装衬衫Ｓ・ブルー</p>
						</dd>
						<dd class="btn">
							<i class="iconfont icon-buynow"></i>
							<span>立即购买</span>
						</dd>
					</dl>
				</a>
			</li>
			<li>
				<a href="javascript:void(0);">
					<dl class="box-shadow">
						<dt>
							<img src="images/pro1_4.png" alt="男士服装" title="男士服装">
						</dt>
						<dd>
							<strong>¥289</strong>
						</dd>
						<dd class="box">
							<p>无印良品クコットン男<br>装衬衫Ｓ・ブルー</p>
						</dd>
						<dd class="btn">
							<i class="iconfont icon-buynow"></i>
							<span>立即购买</span>
						</dd>
					</dl>
				</a>
			</li>
			<li class="bb1">
				<a href="javascript:void(0);">
					<dl class="box-shadow">
						<dt>
							<img src="images/pro2_1.png" alt="女士服装" title="女士服装">
						</dt>
						<dd>
							<strong>¥99</strong>
						</dd>
						<dd class="box">
							<p>无印良品クコットン女<br>装内搭Ｓ・ブルー</p>
						</dd>
						<dd class="btn">
							<i class="iconfont icon-buynow"></i>
							<span>立即购买</span>
						</dd>
					</dl>
				</a>
			</li>
			<li>
				<a href="javascript:void(0);">
					<dl class="box-shadow">
						<dt>
							<img src="images/pro2_2.png" alt="女士服装" title="女士服装">
						</dt>
						<dd>
							<strong>¥199</strong>
						</dd>
						<dd class="box">
							<p>无印良品クコットン女<br>装打底装 条纹浅白色...</p>
						</dd>
						<dd class="btn">
							<i class="iconfont icon-buynow"></i>
							<span>立即购买</span>
						</dd>
					</dl>
				</a>
			</li>
			<li>
				<a href="javascript:void(0);">
					<dl class="box-shadow">
						<dt>
							<img src="images/pro2_3.png" alt="女士服装" title="女士服装">
						</dt>
						<dd>
							<strong>¥299</strong>
						</dd>
						<dd class="box">
							<p>无印良品クコットン女<br>装 针织衫Ｓ・ブルー</p>
						</dd>
						<dd class="btn">
							<i class="iconfont icon-buynow"></i>
							<span>立即购买</span>
						</dd>
					</dl>
				</a>
			</li>
			<li>
				<a href="javascript:void(0);">
					<dl class="box-shadow">
						<dt>
							<img src="images/pro2_4.png" alt="女士服装" title="女士服装">
						</dt>
						<dd>
							<strong>¥199</strong>
						</dd>
						<dd class="box">
							<p>无印良品クコットン女<br>装 长衬衫ブルー</p>
						</dd>
						<dd class="btn">
							<i class="iconfont icon-buynow"></i>
							<span>立即购买</span>
						</dd>
					</dl>
				</a>
			</li>
			<li>
				<a href="javascript:void(0);">
					<dl class="box-shadow">
						<dt>
							<img src="images/pro3_1.png" alt="服饰装饰" title="服饰装饰">
						</dt>
						<dd>
							<strong>¥150</strong>
						</dd>
						<dd class="box">
							<p>无印良品翘边帽两色可<br>选百搭Ｓ・ブルー</p>
						</dd>
						<dd class="btn">
							<i class="iconfont icon-buynow"></i>
							<span>立即购买</span>
						</dd>
					</dl>
				</a>
			</li>
			<li>
				<a href="javascript:void(0);">
					<dl class="box-shadow">
						<dt>
							<img src="images/pro3_2.png" alt="服饰装饰" title="服饰装饰">
						</dt>
						<dd>
							<strong>¥199</strong>
						</dd>
						<dd class="box">
							<p>无印良品クコットン女<br>装沙滩帽</p>
						</dd>
						<dd class="btn">
							<i class="iconfont icon-buynow"></i>
							<span>立即购买</span>
						</dd>
					</dl>
				</a>
			</li>
			<li class="mb0">
				<a href="javascript:void(0);">
					<dl class="box-shadow">
						<dt>
							<img src="images/pro3_3.png" alt="服饰装饰" title="服饰装饰">
						</dt>
						<dd>
							<strong>¥299</strong>
						</dd>
						<dd class="box">
							<p>无印良品帆布鞋三色可<br>选 新品</p>
						</dd>
						<dd class="btn">
							<i class="iconfont icon-buynow"></i><span>立即购买</span>
						</dd>
					</dl>
				</a>
			</li>
			<li class="mb0">
				<a href="javascript:void(0);">
					<dl class="box-shadow">
						<dt>
							<img src="images/pro3_4.png" alt="服饰装饰" title="服饰装饰">
						</dt>
						<dd>
							<strong>¥199</strong>
						</dd>
						<dd class="box">
							<p>无印良品全框眼镜木制</p>
						</dd>
						<dd class="btn">
							<i class="iconfont icon-buynow"></i>
							<span>立即购买</span>
						</dd>
					</dl>
				</a>
			</li>
		</ul>
	</section>
	<section class="footr-nav">
		<div>
			<a href="javascript:void(0);">
				<i class="iconfont icon-shouye"></i>
				<span>首页</span>
			</a>
			<a class="active" href="javascript:void(0);">
				<i class="iconfont icon-fenlei"></i>
				<span>分类</span>
			</a>
			<a href="javascript:void(0);">
				<i class="iconfont icon-gouwuche"></i>
				<span>购物车</span>
			</a>
			<a href="javascript:void(0);">
				<i class="iconfont icon-gerenzhongxin"></i>
				<span>个人中心</span>
			</a>
		</div>
	</section>


	<script src="js/jquery-1.10.2.min.js"></script>
	<script src="js/swiper.min.js"></script>
	<script src="js/common.js"></script>
<!-- 	<script>
				alert($(".bb1").height());
				alert($(".bb1").next().height());
			</script> -->
</body>
</html>